
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">

    <title>test</title>

    <link rel="shortcut icon" href="/favicon.ico" />
    <link rel="stylesheet" href="/stylesheets/screen.css">

    <script src="/javascripts/jquery-1.6.1.min.js"></script>
     <style>
       div{
         background-color:#eeeeee;
         border:1px solid red;
       }
       .c1r1{
         width:200px;
         height:200px;
       }
       .c2r1{
         height:400px;
         width:200px;
       }
       .c2r2{
         width:400px;
         height:400px;
       }
       .c4r3{
         width:800px;
         height:800px;
       }
       .left{
         float:left;
       }
       .clear{
         clear:both;
       }


</style>

  </head>
  <body>
    <div class="c4r3 left">3</div>
    <div class="c1r1 left">1</div>
    <div class="c1r1 left">1</div>
    <div class="c2r1 left">2</div>
    <div class="c1r1 left">4</div>
<div class="c1r1 left">4</div>
    <div class="c2r1 left">5</div>
    <div class="c1r1 left">6</div>
<div class="c1r1 left">6</div>
    <div class="c2r1 left">6</div>
    <div class="c1r1 left">7</div>
<div class="c1r1 left">6</div>
    <div class="c2r1 left">8</div>
    <div class="c2r1 left">9</div>
    <div class="c2r1 left">10</div>
    <div class="c2r1 left">11</div>
    <div class="c1r1 left">12</div>
<div class="c1r1 left">6</div>  

  </body>
</html>